<%@ page pageEncoding='UTF-8'%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<s:set var="contextPath" value="#request.get('javax.servlet.forward.context_path')" scope="request" />
<!DOCTYPE html>
<head>
    <title>Assistant Registration</title>
    <%-- header --%>
    <jsp:include page="/WEB-INF/content/common/Header.jsp" flush="true"/>
    <script src="${contextPath}/js/jquery/jquery.validate.js"></script>
    <script src="${contextPath}/js/jquery/jquery.maskedinput.min.js"></script>
    <script src="${contextPath}/js/assistant/assistant.js"></script>
</head>
<body class="metro home">
	<%-- tob-bar --%>
    <jsp:include page="/WEB-INF/content/common/TopBar.jsp" flush="true"/>
       	
	<div id="main-container" class="body-wrapper">
        <%-- tob-container --%>
    	<jsp:include page="/WEB-INF/content/common/TopContainer.jsp" flush="true"/>
        
    	<div id="body-container">
        	<div id="assistant-registration-form-container" class="form-container">
            
            	<%-- header-container --%>
                	<s:set var="mode" value="'registration'"/>
	   				<jsp:include page="/WEB-INF/content/assistant/AssistantMenuContainer.jsp" flush="true"/>
                    
            	<div class="form-body-container">
                	<form id="assistant-registration-form" class="registration-form assistant-form" action="${contextPath}/assistant/insert" method="post">
                	<input type="hidden" name="guiAssistant.userId" value="" />
                	<fieldset>
                    	<legend style="width:95%">Assistant Registration</legend>
                        <label>Name<em class="text-alert">*</em></label>
                        <div class="input-control text" style="width:95%">
                        	<input type="text" name="guiAssistant.name" value="" placeholder="input name" required/>
                            <button class="btn-clear"></button>
						</div>
                        <label>Type</label>
                        <div style="width:95%">
                        	<input type="hidden" name="guiAssistant.type" value="ASSISTANT" placeholder="input text"/>
                            <div class="input-control text">
    							<input type="text" value="" placeholder="Assistant" disabled/>
    							<button class="btn-clear"></button>
							</div>
						</div>
                        <label>Qualifications<em class="text-alert">*</em></label>
                        <div class="input-control text" style="width:95%">
                        	<input type="text" name="guiAssistant.qualifications" value="" placeholder="input qualifications" required/>
						</div>
                        <label>Others</label>
                        <div class="input-control text" style="width:95%">
                        	<input type="text" name="guiAssistant.others" value="" placeholder="input other qualifications"/>
						</div>
                        <label>Telephone<em class="text-alert">*</em></label>
							<div>
								<div class="input-control text" style="width:95%">
		                        	<input type="text" name="guiAssistant.contact.telNo" value="${guiAssistant.contact.telNo}" placeholder="ex:(xxx) xxx-xxxx" class="required user-contact"/>
		                            <button class="btn-clear"></button>
								</div>
							</div>
							<label>Address<em class="text-alert">*</em></label>
	                    	<div>
								<div class="input-control text" style="width:95%">
		                        	<input type="text" name="guiAssistant.contact.address" value="${guiAssistant.contact.address}" placeholder="insert address" class="required"/>
		                            <button class="btn-clear"></button>
								</div>
							</div>
	                        <div>
                        <label>Admin</label>
                        <div>
							<div class="input-control radio default-style" data-role="input-control">
								<label>
									<input type="radio" name="guiAssistant.admin" value="true"/>
									<span class="check"></span> Yes
								</label>
							</div>
							<div class="input-control radio default-style" data-role="input-control">
								<label>									
									<input type="radio" name="guiAssistant.admin" value="false" checked="checked"/>
									<span class="check"></span> No
								</label>
							</div>
						 </div>                   
                         <div class="form-button-container">
                            <a onClick="$('#assistant-registration-form').submit(); return false;">
                                <div class="form-button tile half-vertical subheader-secondary bg-cobalt fg-white">
                                    Insert <i class="icon-pencil on-right smaller"></i>
                                </div>
                            </a>                            
                            <a href="${contextPath}">
                                <div class="form-button tile half-vertical subheader-secondary bg-cyan fg-white">
                                    Cancel <i class="icon-cancel-2 on-right smaller"></i>
                                </div>
                            </a>
	                    </div>
        			</fieldset>
        			</form>
                </div>
        		
    		</div>    
    	</div>
        
        <%-- bottom-container --%>
    	<jsp:include page="/WEB-INF/content/common/BottomContainer.jsp" flush="true"/>
        
	</div>
    
    <%-- footer-container --%>
    <jsp:include page="/WEB-INF/content/common/FooterContainer.jsp" flush="true"/>
    
</body>
</html>